<!-- Dom模板 -->
<template>
  <div class="inp4">
    <!-- Dom内容 -->
    <el-select v-model="value" @change="optyop">
      <el-option
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option>
    </el-select>
  </div>
</template>

<script>
// import a from './a'; // 引入组件
export default {
  name: "",
  data() {
    return {
      msg: "测试",
      options: [
        {
          value: "全部",
          label: "全部",
        },
        {
          value: "5星",
          label: "5星",
        },
        {
          value: "4星",
          label: "4星",
        },
        {
          value: "3星",
          label: "3星",
        },
        {
          value: "2星",
          label: "2星",
        },
        {
          value: "1星",
          label: "1星",
        },
      ],
      value: "",
    };
  },
  // 生命周期 - 创建完成（访问当前this实例）
  created() {
    this.value = this.options[0].value;
    this.$emit("selectQis", this.value);
  },
  // 生命周期 - 挂载完成（访问DOM元素）
  mounted() {},
  // Vue方法定义
  methods: {
    optyop() {
      this.$emit("selectQis", this.value);
    },
  },
};
</script>

<style scoped>
/* @import url(''); 引入css类 */
.inp4 {
  width: 90px;
  float: left;
}
#inp4 {
  width: 90px;
  height: 28px;
  border: none;
  outline: none;
  background: white;
}
#inp4 option {
  outline: none;
  background: white;
  border: 1px solid red;
}
</style>
<style>
.inp4>.el-select .el-input--suffix .el-input__inner {
  width: 90px ;
  height: 28px;
  border: none;
  outline: none;
  background: white;
}
</style>